import React, { Component } from 'react';
import { Dialog, Button, Feedback } from '@icedesign/base';
import IceContainer from '@icedesign/container';
import { enquireScreen } from 'enquire-js';
import axios from 'axios';
import Config from '../../../../utils/Config';
import {DELETE} from '../../../../utils/public'

export default class ConfirmDeleteDialog extends Component {
  static displayName = 'ConfirmDeleteDialog';

  constructor(props) {
    super(props);
    this.state = {
      visible: false,
      isMobile: false,
      obj:{}
    };
  }

  componentDidMount() {
    this.enquireScreenRegister();
  }

  enquireScreenRegister = () => {
    const mediaCondition = 'only screen and (max-width: 720px)';

    enquireScreen((mobile) => {
      this.setState({
        isMobile: mobile,
      });
    }, mediaCondition);
  };

  onOpen=(obj,url)=>{
    //console.log(obj)
    this.setState({obj:obj,url:url})
    this.setState({
      visible: true,
    });
   
  }
  onOk=()=>{
    let id = this.state.obj.id;

    let url = this.state.url;
    //console.log(id)
    DELETE(url+id)
    .then(res=>{
      if(!res){
        Feedback.toast.error("与服务器失去连接，稍后再试！")
        this.hideDialog();
        this.props.onChange(false)
      }else if(res.code== '200' && res.success){
        Feedback.toast.success('删除成功');
        this.hideDialog();
        this.props.onChange(true)//回调函数传递参数给父组件
      }else if(res.code== '200' && !res.success){
        Feedback.toast.error(`${res.msg}`)
        this.props.onChange(false)
      }else if(res.code==401 && res.msg=='请登录!'){
        Feedback.toast.error(res.msg);
        setTimeout(()=>{
          window.location.href='#/Login'
        },500)
      }else{
        Feedback.toast.error(`出错了,${res.msg}`);
        this.props.onChange(false)
      }
    },error=>{
        Feedback.toast.error(`出错了,${error}`);
        this.props.onChange(false)
    })
    // axios.delete(url+id).then((response)=>{
    //   let res = response.data;
    //   if(res.code == 200 && res.success){
    //     Feedback.toast.success('删除成功')
    //     this.hideDialog();
    //     this.props.onChange(true)//回调函数传递参数给父组件
    //   }else{
    //     Feedback.toast.error(res.data.msg);
    //   }
    // }).catch((error)=>{
    //   Feedback.toast.error(error);
    // })
  }

  showDialog = () => {
    this.setState({
      visible: true,
    });
  };

  hideDialog = () => {
    this.setState({
      visible: false,
    });
  };

  render() {
    const { isMobile } = this.state;
    const dialogStyle = {
      width: isMobile ? '320px' : '640px',
      height: isMobile ? 'auto' : '340px',
    };

    return (
        <Dialog
          className="confirm-dialog"
          style={{ ...dialogStyle }}
          autoFocus={false}
          footerAlign="center"
          title="删除提示"
          onOk={this.onOk.bind(this)}
          onCancel={this.hideDialog}
          onClose={this.hideDialog}
          {...this.props}
          visible={this.state.visible}
        >
          <div style={styles.dialogContent}>
            <img
              style={styles.icon}
              src="//img.alicdn.com/tfs/TB1PTrfb_nI8KJjy0FfXXcdoVXa-52-52.png"
              srcSet="//img.alicdn.com/tfs/TB1c5feb46I8KJjy0FgXXXXzVXa-104-104.png"
              alt=""
            />
            <p style={styles.text}>
              {this.props.text ? this.props.text : '确定要删除吗？'}
            </p>
          </div>
        </Dialog>
    );
  }
}

const styles = {
  icon: {
    width: '52px',
    height: '52px',
    marginTop: '26px',
    marginBottom: '10px',
  },
  dialogContent: {
    height: '160px',
    display: 'flex',
    flexDirection: 'column',
    alignItems: 'center',
  },
  text: {
    fontSize: '16px',
  },
};
